<html>
<head>
	<title>Pedidos a elaborar</title>
  <style type="text/css">
	body {	background-color: gray; padding: 20px; font-family: Segoe UI; }
	h1, h2 { font-weight: lighter; }
	h1 { border-bottom: 1px solid black; }
	.button	{ margin-top: 5px;	clear: both; width: 150px; }
	#abrir-mesa { width: 50%; border: 1px solid black; margin-left: 25%; background-color: white; padding: 20px; }
	.text-box { float: left; }
	.separator { border-bottom: 1px solid black; margin-bottom: 10px; height: 10px; clear: both;}
	.left { float: left; }
	.clear { clear: both; }
	.fixed { width: 40%; }
	.center { margin-left: 5%; }
	table { border: 1px solid black; text-align: center; width: 100%;}
	td { border: 1px solid black; padding: 5px; }	
	.header { background-color: gray; font-weight: bold; }
  </style>
</head>
<body>
	<div id="abrir-mesa">
		<h1>Pedidos a elaborar</h1>
		
		<h2>Elija un area de elaboracion</h2>
		
		<select>
		  <option value="1">Cocina</option>
		  <option value="2">Barra</option>
		  <option value="3">Cafeteria</option>
		  <option value="4">Etc..</option>
		</select>
		
		<div class="separator"></div>
		
		<table>
			<tr class="header">
				<td>
					Numero de pedido
				</td>
				<td>
					Plato
				</td>
				<td>
					Cantidad
				</td>
			</tr>
			<tr>
				<td>
					1
				</td>
				<td>
					Bife de chorizo
				</td>
				<td>
					2
				</td>
			</tr>
			<tr>
				<td>
					1
				</td>
				<td>
					Sorrentinos
				</td>
				<td>
					2
				</td>
			</tr>
			<tr>
				<td>
					5
				</td>
				<td>
					Milanesa a la napolitana
				</td>
				<td>
					1
				</td>
			</tr>
		</table>
	</div>
<body>
<html>